<!-- eslint-disable no-redeclare -->
<!-- eslint-disable no-import-assign -->
<script setup lang="ts">
// @ts-nocheck
// #ifndef H5
import BlankHolder from '@decoration/components/blank-holder/blank-holder.vue'
import CubeBox from '@decoration/components/cube-box/cube-box.vue'
import Good from '@decoration/components/good/good.vue'
import ResizeImage from '@decoration/components/resize-image/resize-image.vue'
import RichTextArea from '@decoration/components/rich-text/rich-text.vue'
import Search from '@decoration/components/search/search.vue'
import Separator from '@decoration/components/separator/separator.vue'
import ShopNav from '@decoration/components/shop-nav/shop-nav.vue'
import CusSwiper from '@decoration/components/swiper/swiper.vue'
import TitleBar from '@decoration/components/title-bar/title-bar.vue'
import CusVideo from '@decoration/components/cus-video/cus-video.vue'
import ShopGoods from '@/decoration/components/shop-goods/shop-goods.vue'
import PositioningStyle from '@/decoration/components/positioning-style/positioning-style.vue'
import ComposeSwiper from '@/decoration/components/compose-swiper/compose-swiper.vue'
import ComposeLocation from '@/decoration/components/compose-location/compose-location.vue'
import ShopGoodsO2o from '@/decoration/components/shop-goods/shop-goods-o2o/shop-goods-o2o.vue'
// 插件引入
import SecKill from '@plugin/secKill/components/decorationComponents/sec-kill.vue'
// #endif
// #ifdef H5
const BlankHolder = defineAsyncComponent(() => import('@decoration/components/blank-holder/blank-holder.vue'))
const CubeBox = defineAsyncComponent(() => import('@decoration/components/cube-box/cube-box.vue'))
const Good = defineAsyncComponent(() => import('@decoration/components/good/good.vue'))
const ResizeImage = defineAsyncComponent(() => import('@decoration/components/resize-image/resize-image.vue'))
const RichTextArea = defineAsyncComponent(() => import('@decoration/components/rich-text/rich-text.vue'))
const Search = defineAsyncComponent(() => import('@decoration/components/search/search.vue'))
const Separator = defineAsyncComponent(() => import('@decoration/components/separator/separator.vue'))
const ShopNav = defineAsyncComponent(() => import('@decoration/components/shop-nav/shop-nav.vue'))
const CusSwiper = defineAsyncComponent(() => import('@decoration/components/swiper/swiper.vue'))
const TitleBar = defineAsyncComponent(() => import('@decoration/components/title-bar/title-bar.vue'))
const CusVideo = defineAsyncComponent(() => import('@decoration/components/cus-video/cus-video.vue'))
const ShopGoods = defineAsyncComponent(() => import('@/decoration/components/shop-goods/shop-goods.vue'))
const PositioningStyle = defineAsyncComponent(() => import('@/decoration/components/positioning-style/positioning-style.vue'))
const SecKill = defineAsyncComponent(() => import('@plugin/secKill/components/decorationComponents/sec-kill.vue'))
const ComposeSwiper = defineAsyncComponent(() => import('@decoration/components/compose-swiper/compose-swiper.vue'))
const ComposeLocation = defineAsyncComponent(() => import('@decoration/components/compose-location/compose-location.vue'))
const ShopGoodsO2o = defineAsyncComponent(() => import('@/decoration/components/shop-goods/shop-goods-o2o/shop-goods-o2o.vue'))
// #endif
// #ifdef MP-WEIXIN
import LiveComponent from '@plugin/live/components/decorationComponents/live.vue'
// #endif
import { defineAsyncComponent, PropType, ref } from 'vue'

interface DecorateItemType {
  formData: any
  icon: string
  id: string
  label: string
  value: string
}
const $props = defineProps({
  decorateList: {
    type: Array as PropType<DecorateItemType[]>,
    default() {
      return []
    },
  },
})
</script>
<template>
  <view>
    <view v-for="(item, index) in $props.decorateList" :key="index">
      <!-- 组合组件 -->
      <view v-if="item.value === 'compose'">
        <ComposeLocation v-if="item.formData?.positionStyle?.show" :decorationProperties="item.formData.positionStyle" />
        <Search v-if="item.formData?.search.show" :decoration-properties="item.formData.search" />
        <ComposeSwiper v-if="item.formData?.swiper.swiperList.length > 0" :decoration-properties="item.formData.swiper"></ComposeSwiper>
      </view>
      <BlankHolder v-else-if="item.value === 'blankPaceholder'" :decoration-properties="item.formData" />
      <CubeBox v-else-if="item.value === 'cubeBox'" :decoration-properties="item.formData" />
      <Good v-else-if="item.value === 'goods'" :decoration-properties="item.formData" />
      <ResizeImage v-else-if="item.value === 'resizeImage'" :decoration-properties="item.formData" />
      <RichTextArea v-else-if="item.value === 'richText'" :decoration-properties="item.formData" />
      <Search v-else-if="item.value === 'search'" :decoration-properties="item.formData" />
      <Separator v-else-if="item.value === 'separator'" :decoration-properties="item.formData" />
      <ShopNav v-else-if="item.value === 'navigation'" :decoration-properties="item.formData" />
      <CusSwiper v-else-if="item.value === 'swiper'" :decoration-properties="item.formData" />
      <TitleBar v-else-if="item.value === 'titleBar'" :decoration-properties="item.formData" />
      <CusVideo v-else-if="item.value === 'video'" :decoration-properties="item.formData" />
      <SecKill v-else-if="item.value === 'secKill'" :decoration-properties="item.formData" />
      <ShopGoods v-else-if="item.value === 'shopGoods'" :item="item" :decoration-properties="item.formData" />
      <PositioningStyle v-else-if="item.value === 'positioningStyle'" :decoration-properties="item.formData" />
      <!-- <ShopGoodsO2o v-if="item.value === 'shopGoodsO2O'" :decoration-properties="item.formData" /> -->
      <!-- #ifdef MP-WEIXIN -->
      <LiveComponent v-else-if="item.value === 'live'" :decoration-properties="item.formData" />
      <!-- #endif -->
    </view>
  </view>
</template>

<style lang="scss" scoped></style>
